<template>
    <section class="cicd-workspace">
        <el-form ref="workspaceData" :model="workspaceData" label-width="93px" size="mini">
            <el-form-item label="项目名"  prop="name">
                <el-col :span="4">

                    <el-tag type="default" size="mini">{{workspaceData.name}}</el-tag>
                </el-col>

            </el-form-item>


            <el-form-item label="工作空间"  prop="name" >
                <el-col :span="24" v-if="bool">
                    <VJstree :data="jstreedata"  multiple allow-batch whole-row >
                        <template scope="_">
                            <div style="display: inherit; width: 500px" v-if="_.model.icon"  >
                                <i :class="_.vm.themeIconClasses" role="presentation" v-if="!_.model.loading"></i>

                                {{_.model.text}}

                                    &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

                                <el-button-group>
                                <el-button type="primary" class="minizisesize" plain  size="mini"  @click="DownFile(_.model)" >下载</el-button>
                                <el-tooltip :content="_.model.mdtime +  '     '+ _.model.fsize" placement="right" effect="light" size="mini">
                                    <el-button type="success" class="minizisesize" plain size="mini"  @click="lookFile(_.model)" >查看</el-button>
                                </el-tooltip>
                                </el-button-group>






                            </div>
                        </template>
                    </VJstree>

                </el-col>

            </el-form-item>


            <el-form-item>
                <el-button @click="cleanWorkspace">清空</el-button>
                <el-button @click="closeThisTab">关闭</el-button>
            </el-form-item>
        </el-form>


    </section>
</template>
<script>
    import { LoadWorkspace,CleanWorkspace } from '../../api/api'
    import VJstree from 'vue-jstree'

    import saveAs from 'file-saver';
    var FileSaver = require('file-saver');

    export default {
        props: {
            deployItem: Object,

        },
        data() {
            return {
                bool:true,
                workspaceData: {
                    name: '',
                    workpath: '',
                },
                jstreedata: [],
                defaultProps: {
                    children: 'children',
                    label: 'label'
                }
            }
        },
        methods: {
            cleanWorkspace(){
                //alert(this.workspaceData.workpath)
                let param = {yamlpath: this.workspaceData.workpath}
                CleanWorkspace(param).then((res) => {
                    console.log("the delete result code :" , res.code)
                    if (res.code === 200) {
                        this.$message({
                            type: 'success',
                            message: '清理成功!'
                        });
                        this.$emit('close_tab')

                    }
                })
            },

            closeThisTab() {
                this.$emit('close_tab')
            },
            lookFile(model) {

                //console.log(node.model.text + ' clicked !')
                console.log(model.path + ' clicked !')
                //alert("look file")
                //this.$emit('watchFile',model.path); 报错无法打开
                console.log(model.path + ' clicked down!')

                this.$emit('watchFile',model.path);
            },
            DownFile(model) {
                let url = "http://127.0.0.1:8088/" + model.path
                let filename = model.text
                FileSaver.saveAs(url,filename)
            },
            getWorkspace(name) {
                let param = {name: name};
                let that = this;
                that.bool = false
                LoadWorkspace(param).then((res) => {
                    //debugger
                    console.log("..api...")
                    //console.log(res.dirStruct)
                    console.log(typeof JSON.parse(res.dirStruct))
                    console.log(JSON.parse(res.dirStruct))
                    console.log("...this..")
                    console.log(typeof  that.jstreedata)
                    console.log(that.jstreedata)
                    that.jstreedata = JSON.parse(res.dirStruct);
                    that.bool = true   //再次初始化
                    //that.jstreedata = JSON.parse(res.dirStruct)
                })
            }
        },
        created() {
            console.log("this item is",this.deployItem) //ojbk continue
            this.workspaceData.name = this.deployItem.name
            this.workspaceData.workpath = this.deployItem.yamlpath

            this.getWorkspace(this.deployItem.name)
        },
        components: {
            VJstree
        }

    }
</script>

